
$(function () {
    var timer = null; //声明一个全局定时器
    var index = 0;
    $(".arr-next").click(function () { //下一张
        next1();
    });
    $(".arr-pre").click(function () { //上一张
        prev1();
    })
    function next1() {
        index++;
        if (index > 0) {
            /*
            当图片到最后一张时跳回第一张，本例中在最后一张中放入了第一张的图片，为实现无缝切换图片的效果。
            */
            $("ol").animate({ left: -(index) * 142 }, 500);
            index = 0;
            $("ol").animate({ left: 0 }, 0); //
        }
        $("ol").animate({ left: -index * 142 }, 500);
        iconHover(index);
    }
    function prev1() {
        index--;
        if (index < 0) {
            index = 0;
            $("ol").animate({ left: -(index + 1) * 142 }, 0);
        }
        $("ol").animate({ left: -index * 142 }, 500);
        iconHover(index);
    }
    function auto() {
        timer = setInterval(function () { //设置自动播放的定时器
            next1();
            iconHover(index);
        }, 2000)
    }
    auto();
    $(".imgbox2").mouseover(function () { //鼠标移入 定时器取消
        clearInterval(timer);

    })
    $(".imgbox2").mouseleave(function () { //鼠标离开 定时器开启
        auto();

    })
    //鼠标碰触圆点图标实现图片左右轮播
    $(".icon-list li").mouseover(function () {
        var index = $(this).index();
        $("ol").animate({ left: -index * 142 }, 500);
        iconHover(index);

    })
    //实现被选图片对应圆点图标索引更新
    function iconHover(index) {
        $(".icon-list li").eq(index).addClass("active").siblings().removeClass("active");

    }

})